<template>
  <div>
    <form action="/">
  <van-search
    v-model="value"
    show-action
    placeholder="请输入搜索关键词"
    @search="onSearch"
    @cancel="onCancel"
  />
  <div class="search-history">
    <van-cell
      title="搜索历史"
    >
      <div >

        <span>全部删除</span>
        &nbsp;&nbsp;
        <span>完成</span>
      </div>
      <van-icon

        name="delete"

      />
    </van-cell>
    <van-cell
      title="111"
    >
      <van-icon
        name="close"
      />
    </van-cell>
  </div>
</form>
  </div>
</template>

<script>
import { Search } from 'vant';
import { Toast } from 'vant';

export default {
    components: {
    [Search.name]: Search,
    },
    data() {
    return {
      value: '',
    };
  },
  methods: {
    onSearch(val) {
      Toast(val);
    },
    onCancel() {
      this.$router.back();
    },
  },

}
</script>

<style>

</style>